<template>
  <div>
    <el-button
      v-if="!disabled"
      class="add"
      size="mini"
      icon="el-icon-circle-plus-outline"
      type="success"
      @click="addFn"
      style="margin-bottom: 15px"
    >添加
    </el-button>
    <el-table
      :data="agent"
      size="small"
      border
      :show-header="false"
    >
      <el-table-column
        type="index"
        align="center"
        label="序号"
        width="50"
      >
      </el-table-column>
      <el-table-column prop="requestJustification" align="center" label="社会统一信用代码/身份证号">
        <template slot-scope="{ row }">
          <el-input size="small" :title="row.code" v-model="row.code"/>
        </template>
      </el-table-column>
      <el-table-column prop="requestJustification" align="center" label="社会统一信用代码/身份证号">
        <template slot-scope="{ row }">
          <el-input size="small" :title="row.code" v-model="row.code"/>
        </template>
      </el-table-column>
      <el-table-column prop="requestJustification" align="center" label="社会统一信用代码/身份证号">
        <template slot-scope="{ row }">
          <el-input size="small" :title="row.code" v-model="row.code"/>
        </template>
      </el-table-column>
      <el-table-column prop="requestJustification" align="center" label="社会统一信用代码/身份证号">
        <template slot-scope="{ row }">
          <el-input size="small" :title="row.code" v-model="row.code"/>
        </template>
      </el-table-column>
      <el-table-column prop="requestJustification" align="center" label="社会统一信用代码/身份证号">
        <template slot-scope="{ row }">
          <el-input size="small" :title="row.code" v-model="row.code"/>
        </template>
      </el-table-column>
      <el-table-column prop="requestJustification" align="center" label="社会统一信用代码/身份证号">
        <template slot-scope="{ row }">
          <el-input size="small" :title="row.code" v-model="row.code"/>
        </template>
      </el-table-column>
      <el-table-column prop="requestJustification" align="center" label="社会统一信用代码/身份证号">
        <template slot-scope="{ row }">
          <el-input size="small" :title="row.code" v-model="row.code"/>
        </template>
      </el-table-column>
      <el-table-column prop="requestJustification" align="center" label="社会统一信用代码/身份证号">
        <template slot-scope="{ row }">
          <el-input size="small" :title="row.code" v-model="row.code"/>
        </template>
      </el-table-column>
      <el-table-column prop="requestJustification" align="center" label="社会统一信用代码/身份证号">
        <template slot-scope="{ row }">
          <el-input size="small" :title="row.code" v-model="row.code"/>
        </template>
      </el-table-column>
      <el-table-column prop="requestJustification" align="center" label="社会统一信用代码/身份证号">
        <template slot-scope="{ row }">
          <el-input size="small" :title="row.code" v-model="row.code"/>
        </template>
      </el-table-column>
      <el-table-column prop="requestJustification" align="center" label="社会统一信用代码/身份证号">
        <template slot-scope="{ row }">
          <el-input size="small" :title="row.code" v-model="row.code"/>
        </template>
      </el-table-column>
      <el-table-column prop="requestJustification" align="center" label="社会统一信用代码/身份证号">
        <template slot-scope="{ row }">
          <el-input size="small" :title="row.code" v-model="row.code"/>
        </template>
      </el-table-column>
      <el-table-column prop="requestJustification" align="center" label="社会统一信用代码/身份证号">
        <template slot-scope="{ row }">
          <el-input size="small" :title="row.code" v-model="row.code"/>
        </template>
      </el-table-column>
      <el-table-column prop="requestJustification" align="center" label="社会统一信用代码/身份证号">
        <template slot-scope="{ row }">
          <el-input size="small" :title="row.code" v-model="row.code"/>
        </template>
      </el-table-column>
      <el-table-column prop="requestJustification" align="center" label="社会统一信用代码/身份证号">
        <template slot-scope="{ row }">
          <el-input size="small" :title="row.code" v-model="row.code"/>
        </template>
      </el-table-column>
      <el-table-column prop="requestJustification" align="center" label="社会统一信用代码/身份证号">
        <template slot-scope="{ row }">
          <el-input size="small" :title="row.code" v-model="row.code"/>
        </template>
      </el-table-column>
      <el-table-column prop="requestJustification" align="center" label="社会统一信用代码/身份证号">
        <template slot-scope="{ row }">
          <el-input size="small" :title="row.code" v-model="row.code"/>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>

/**涉案主体 */
export default {
  props: {
    /**是否禁用 */
    disabled: {
      type: Boolean,
      default: false
    },
    handId: {
      type: String,
      default: ''
    },
    deleteUrl: {
      type: String,
      default: ''
    },
    type: {
      type: String,
      default: '0'
    },
  },
  data() {
    return {
      agent: [],
      companyOptions: [],
      yesOrNo: []
    }
  },
  methods: {
    change(){
      this.$refs.CascaderRef.dropDownVisible = false
    },
    /*
    * @author    zl
    * @功能       添加
    * @公司       栢柯
    * @date      2022-12-29
    * */
    addFn() {
      let obj = {}
      newArr.filter(item => {
        for(var i in item) {
          console.log(item, i)
          if(i == 'date2') {
            obj[item[i]] = item.dateTime3
            obj.canEdit = true
          }
        }
      })
      let arr = [...this.agent, obj]
      // this.agent.push(obj)
      this.$set(this, 'agent', arr)
    },
    /*
    * @author     zl
    * @功能        编辑
    * @公司       栢柯
    * @date      2022-12-29
    * */
    editFn(index) {
      //当前可编辑
      this.$set(this.agent[index], 'canEdit', true)
      // this.agent[index].canEdit = true
    },
    /*
    * @author    zl
    * @功能      保存
    * @公司      栢柯
    * @date     2022-12-29
    * */
    async submitFn(index) {
      this.agent[index].canEdit = false
      this.$emit('setCaseName')
    },
    /*
    * @author     zl
    * @功能       删除
    * @公司       栢柯
    * @date      2022-12-29
    * */
    deleteFn(index) {
      this.$confirm('是否继续删除?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        cancelButtonClass:'cancelButton',
        confirmButtonClass:'confirmButton',
        type: 'warning'
      }).then(() => {
        const id = this.agent[index].id
        if (id) {
          PostForm(this.deleteUrl, { id }).then(res => {
            if (res.code === 200) {
              this.$message.success(res.msg)
              this.agent.filter((it, index) => {
                if (it.id === id) {
                  this.agent.splice(index, 1)
                  this.$emit('setCaseName')
                }
              })
            }
          })
        } else {
          this.agent.splice(index, 1)
          this.$emit('setCaseName')
        }
      })
    }
  }
}

</script>

<style scoped>
/deep/ .el-input-number {
  width: 100%;
}

::v-deep .el-table .backgroundColor {
  background: #ddd !important;
}

.text {
  color: #409EFF !important;
}
</style>
